<!--房型详情-->
<template>
  <div v-loading="loading">
    <!-- <Alert type="error">
      <h5>SellOrder.js文件中的扩展SellOrder表的头部信息,你可以在此处定义需要显示的信息,如果需要获取界面的Vue对象属性,参照此扩展组件GridHeaderExtend.vue的说明</h5>
    </Alert> -->
    <!--点击扩展按钮对应的弹出框-->
    <vol-box :model.sync="model" title="合同详情" :width="700" :height="430">
      <VolForm ref="myform" :loadKey="loadKey" :formFileds="formFileds" :formRules="formRules" :labelWidth="130">
      </VolForm>
      <!-- 添加slot槽覆盖footer的按钮，添加新的按钮 -->
      <Button class="btn" v-if="formFileds.url !== '' " type="info" icon="md-refresh" @click="opneUrl">查看合同</Button>
      <div slot="footer">
        <Button type="info" @click="close" icon="md-close">关闭</Button>
      </div>
    </vol-box>
  </div>
</template>
<script>
  import bus from "@/utilities/bus.js";
  import VolForm from "@/components/basic/VolForm.vue";
  export default {
    components: {
      VolBox: () => import("@/components/basic/VolBox.vue"),
      VolForm,
    },
    data() {
      return {
        loading: false,
        loadKey: true,
        model: false,
        formFileds: {
          name: "", //合同名称
          type: "", //类型
          notes: "", //描述
          url: ''

        },
        formRules: [
          [
            {
              title: "合同名称",
              field: "name",
              required: true,
              colSize: 4,
              type: "text",
              disabled: true
            },
            {
              field: "type",
              title: "类别",
              required: true,
              colSize: 4,
              type: "text",
              disabled: true
            },
            {
              field: "notes",
              title: "描述",
              required: true,
              colSize: 4,
              type: "text",
              disabled: true
            },
          ],
          [

          ],

        ],
      };
    },
    created() { },
    methods: {
      open(row) {
        let textarry = {
          name: 'id',
          value: row.contractId,
          displayType: 'text'
        }

        let arry = [textarry]
        this.http
          .post("api/Mall_contract/getPageData", { "order": "desc", "page": 1, "rows": 30, "sort": "id", "order": "desc", "wheres": JSON.stringify(arry) })
          .then((res) => {
            let data = res.rows[0]
            this.model = true;

            this.formFileds.name = data.name;
            this.formFileds.type = data.type;
            this.formFileds.notes = data.notes;
            this.formFileds.url = data.url;
            console.log("行数据", this.formFileds);
          });
      },
      opneUrl() {
        window.open('https://api.boss.i-town.cn/' + this.formFileds.url)
      },
      close() {
        this.model = false;
      },
    },
  };
</script>
<style scoped>
  .btn {
    margin-left: 55px;
  }
</style>